import React, { memo } from 'react';
import { Input } from 'antd';
import { InbizIcon } from '@inbiz/utils';
import { getMessage } from '@inbiz/react';
import { observer } from '@formily/react';
import './index.less';
const SearchBar = observer((props: any) => {
  const { onSearch, $searchText, searchText } = props;
  return (
    <div className="inbiz-AppCenter-searchbart">
      <Input
        allowClear
        placeholder={getMessage('appCenter.placeholder')}
        suffix={
          <InbizIcon
            onClick={() => onSearch(searchText)}
            type="icon-ic-search"
            style={{ fontSize: 16, color: '#8a8a8a' }}
          />
        }
        onPressEnter={(e) => onSearch(searchText)}
        onChange={(e) => $searchText(e.target.value)}
        value={searchText}
      />
    </div>
  );
});

export default SearchBar;
